<template>
  <el-card class="box-card pcborder">
    <div slot="header" class="clearfix">
      <span>基础参数</span>
    </div>
    <div class="text item">
      <!-- {{this.$route.query}} -->
      <el-form
        label-width="100px"
        class="main-form"
        :rules="rules"
        ref="ruleForm"
        :model="ruleForm"
      >
        <el-row :gutter="0" class="pcbbase">
          <el-col :span="14">
                 <el-form-item label="本单面积：" class="alignleft orderarea">
              <el-row :gutter="0">
                <el-col :span="24">
                         <ScrollWarpper :value="this.$store.state.data.pcbNewOrder.orderArea" />  <span class="scroll-num">m²</span>  
                         <!-- <NumberGrow /> -->
                </el-col>
              </el-row>
            </el-form-item>
            
                  <el-form-item label="我司编号：" class="alignleft customerno">
              <el-row :gutter="0">
                <el-col :span="9" >
                     <div  style="cursor:pointer" @click="copynum($store.state.data.pcbInfo[1].pcbpara)"> {{this.$store.state.data.pcbInfo[1].pcbpara}}</div>  
                </el-col>
              </el-row>
            </el-form-item>
            
            <el-form-item label="客户单位：" class="alignleft">
              <el-row :gutter="0">
                <el-col :span="24">
                  <CustomerName /><i @click="copynum($store.state.data.coustomerName)"  style="cursor:pointer" class="el-icon-document-copy copyico"></i>
                </el-col>
              </el-row>
            </el-form-item>
           
            
     
            <el-form-item label="板子层数：" class="alignleft">
              <el-row :gutter="0">
                <el-col :span="24">
                  <PcbLayer
     
                  />
                </el-col>
              </el-row>
            </el-form-item>

            <!-- 尺寸 -->
            <el-row :gutter="0" class="pcbsize">
              <el-form-item label="板子大小：">
                <el-col :span="6">
                  <el-form-item prop="pcbx">
                    <el-input
                      onkeyup="value=value.replace(/[^\d(\.)]/g,'')"
                      v-model="ruleForm.pcbx"
                      placeholder="长(mm)"
                      step="1"
                      min="1"
                      max="1020"
                      class="inputpcb"
                      @input="pcbxInput"
                    ></el-input>
                  </el-form-item>
                </el-col>

                <el-col :span="1" class="line">x</el-col>
                <el-col :span="6">
                  <el-form-item prop="pcby">
                    <el-input
                      onkeyup="value=value.replace(/[^\d(\.)]/g,'')"
                      v-model="ruleForm.pcby"
                      placeholder="宽(mm)"
                      step="1"
                      min="1"
                      max="1020"
                      class="inputpcb"
                      @input="pcbyInput"
                    ></el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="3" class="line">拼数:</el-col>

                <el-col :span="4">
                  <el-input
                    onkeyup="value=value.replace(/^[0]\d*/g,'')"
                    v-model.number="pcbp"
                    placeholder="拼数"
                    step="1"
                    class="inputpcb"
                    @input="pcbpInput"
                  ></el-input>
                </el-col>
              </el-form-item>
            </el-row>

            <!-- 尺寸结束 -->

            <el-row align="middle" :gutter="0">
              <el-col :span="12"  >
                <el-form-item prop="count" label="订单数量："  ref="formconut" >
                  <div @mouseenter="showCount" @mouseleave="hidenCount">
                  <el-input
                    onkeyup="value=value.replace(/^[0][\d(\.)]/g,'')"
                    v-model.number="ruleForm.count"
                    placeholder="订单数量"
                    step="1"
                    class="inputpcb inputcount inputfocus"
                    v-bind:class="{hidenbroad:isShow}"
                    @input="countInput"
                    readonly="readonly"
                    :validate-event="false"
                    ref="inputconut"
                  
                  ></el-input></div>
                
               
                
                </el-form-item>
                 <div class="contLabel" v-bind:class="{showconut:isShow}"  @mouseenter="showCount" @mouseleave="hidenCount"><SelectCount @hiedc="hidenCount" /></div>
              </el-col>

              <el-col :span="12" class="pcbp">
                <el-radio-group v-model="unit" size="mini" class="chenggroup">
                  <el-radio-button class="chengradio" label="pcs"></el-radio-button>
                  <el-radio-button class="chengradio" label="set"></el-radio-button>
                  <el-radio-button class="chengradio" label="大片"></el-radio-button>
                </el-radio-group>
              </el-col>
            </el-row>
          </el-col>

          <el-col :span="10" class="tijiao">
            <!-- 上传文件 -->
            
            <PcbUpload />
             <!-- 提交按钮 plain-->
            <el-button type="success" plain  @click="onSubmit('ruleForm')">提交订单</el-button>
          </el-col>
        </el-row>
        <el-divider class="fengexian"></el-divider>
        <el-form-item label="板材类型：" class="alignleft">
          <el-row :gutter="0">
            <el-col :span="18">
              <PcbType />
            </el-col>
          </el-row>
        </el-form-item>
        <el-form-item label="板材厚度：" class="alignleft">
          <el-row :gutter="0">
            <el-col :span="24">
              <PcbThick />
            </el-col>
          </el-row>
        </el-form-item>
        <el-form-item label="表面工艺：" class="alignleft">
          <el-row :gutter="0">
            <el-col :span="24">
              <PcbSurface />
            </el-col>
          </el-row>
        </el-form-item>
        <el-form-item label="阻焊颜色：" class="alignleft">
          <el-row :gutter="0">
            <el-col :span="24">
              <PcbSolderColor />
            </el-col>
          </el-row>
        </el-form-item>
        <el-form-item label="文字颜色：" class="alignleft">
          <el-row :gutter="0">
            <el-col :span="24">
              <PcbFontColor />
            </el-col>
          </el-row>
        </el-form-item>
        <el-form-item label="过孔处理：" class="alignleft">
          <el-row :gutter="0">
            <el-col :span="24">
              <PcbVar />
            </el-col>
          </el-row>
        </el-form-item>
        <el-form-item label="铜箔厚度：" class="alignleft PcbCopper">
          <el-row :gutter="0">
            <el-col :span="24">
              <PcbCopper />
            </el-col>
          </el-row>
        </el-form-item>
        
      </el-form>
    </div>
  </el-card>
</template>

<script>
import PcbLayer from "../../units/pcbLayer.vue";
import PcbType from "../../units/pcbType.vue";
import PcbThick from "../../units/pcbThick.vue";
import PcbSurface from "../../units/pcbSurface.vue";
import PcbSolderColor from "../../units/pcbSolderColor.vue";
import PcbFontColor from "../../units/pcbFontColor.vue";
import PcbVar from "../../units/pcbVar.vue";
import PcbCopper from "../../units/pcbCopper.vue";
import PcbUpload from "../../units/pcbUload.vue";
import CustomerName from "../../units/customerName.vue";
import SelectCount from "../../units/selectCount.vue";
import ScrollWarpper from "../../units/scrollWarpper.vue";
//import NumberGrow from "../../units/numberGrow.vue";

export default {
  props: ["layer"],
  data() {
    return {
      isShow:false,
      countLb: this.$myF.arrIndex(this.$store.state.data.pcbInfo, "订单数量："),
      layerLb: this.$myF.arrIndex(this.$store.state.data.pcbInfo, "板子层数："),
      sizeLb: this.$myF.arrIndex(this.$store.state.data.pcbInfo, "尺寸(mm)："),
      ruleForm: {
        count: "",
        pcbx: "",
        pcby: "",
      },
      rules: {
        count: [
          { required: true, message: "订单数量不能为空", trigger: "blur" },
   
        ],
        pcbx: [{ required: true, message: "请输入长度", trigger: "blur" }],
        pcby: [{ required: true, message: "请输入宽度", trigger: "blur" }],
      },
    };
  },
  components: {
    CustomerName,
    PcbLayer,
    PcbType,
    PcbThick,
    PcbSurface,
    PcbSolderColor,
    PcbFontColor,
    PcbVar,
    PcbCopper,
    PcbUpload,
    SelectCount,
    ScrollWarpper,
    //NumberGrow
  },
  computed: {
    unit:{
      get:function(){return this.$store.state.data.pcbNewOrder.unit},
      set:function(v){ this.$store.state.data.pcbNewOrder.unit=v}
    },
    pcbp:{
      get:function(){return this.$store.state.data.pcbNewOrder.pcbp},
      set:function(v){ this.$store.state.data.pcbNewOrder.pcbp=v}
    },
    
    count: {
      get: function () {
        return this.$store.state.data.pcbNewOrder.orconut;
      },
      set: function (v) {
        this.$store.state.data.pcbNewOrder.orconut = v;
      },
    },
    pcbx: {
      get: function () {
        return this.$store.state.data.pcbNewOrder.pcbx;
      },
      set: function (v) {
        this.$store.state.data.pcbNewOrder.pcbx = v;
      },
    },
    pcby: {
      get: function () {
        return this.$store.state.data.pcbNewOrder.pcby;
      },
      set: function (v) {
        this.$store.state.data.pcbNewOrder.pcby = v;
      },
    },

  },
  methods: {
  
        copynum: function(val){
        //点击我司编号，复制编号到剪切板
         this.$copyText(val).then(function (e) {
 
        }, 
           this.$message({
            type: "success",
            message: val+" 复制到剪切板",
          }),
        
        function (e) {
          alert('Can not copy')

        })
         
        },
          showCount:function(){
          //鼠标移入数量选择DIV 后触发
           
          this.$refs.formconut.clearValidate();//移除该表单项的校验结果
          this.isShow=true
       
          },
        hidenCount:function(){
          //鼠标移出
          this.isShow=false
       
          this.$refs.inputconut.blur();
        },
        mustreset(formName){
        //必须重置的参数
        //同工艺下单，和继续下新单都执行
          let i
          i=this.$myF.arrIndex(this.$store.state.data.pcbInfo,"客户型号：")
          this.$store.state.data.pcbInfo[i].pcbpara=""
          this.$store.state.data.pcbNewOrder.file=this.$store.state.data.fileInfo
          this.$store.state.data.pcbNewOrder.orconut = ""
          this.ruleForm.count=""
          this.ruleForm.pcbx=""
          this.ruleForm.pcby=""
          this.$store.state.data.pcbNewOrder.unit="pcs"
          this.$store.state.data.pcbNewOrder.pcbp=1
          this.$refs[formName].resetFields();

    },
    orderDf:function(){
        //设置订单默认参数，
        //继续下新订单执行
        let i
        
        i=this.$myF.arrIndex(this.$store.state.data.pcbInfo,"板子层数：")
        this.$store.state.data.pcbInfo[i].pcbpara=this.$store.state.data.pcbLayer
        i=this.$myF.arrIndex(this.$store.state.data.pcbInfo,"板材类型：")
        this.$store.state.data.pcbInfo[i].pcbpara=this.$store.state.data.pcbtypeDF
        i=this.$myF.arrIndex(this.$store.state.data.pcbInfo,"板材厚度：")
        this.$store.state.data.pcbInfo[i].pcbpara=this.$store.state.data.pcbThicknessDF
        i=this.$myF.arrIndex(this.$store.state.data.pcbInfo,"表面工艺：")
        this.$store.state.data.pcbInfo[i].pcbpara=this.$store.state.data.processDF
        i=this.$myF.arrIndex(this.$store.state.data.pcbInfo,"阻焊颜色：")
        this.$store.state.data.pcbInfo[i].pcbpara=this.$store.state.data.maskColorDF
        i=this.$myF.arrIndex(this.$store.state.data.pcbInfo,"文字颜色：")
        this.$store.state.data.pcbInfo[i].pcbpara=this.$store.state.data.textColor
        i=this.$myF.arrIndex(this.$store.state.data.pcbInfo,"过孔处理：")
        this.$store.state.data.pcbInfo[i].pcbpara=this.$store.state.data.viaDF
        i=this.$myF.arrIndex(this.$store.state.data.pcbInfo,"铜箔厚度：")
        this.$store.state.data.pcbInfo[i].pcbpara=this.$store.state.data.copperDF
        i=this.$myF.arrIndex(this.$store.state.data.pcbInfo,"板内增加生产周期：")
        this.$store.state.data.pcbInfo[i].pcbpara=this.$store.state.data.periodDF
        i=this.$myF.arrIndex(this.$store.state.data.pcbInfo,"板内增加我司编号：")
        this.$store.state.data.pcbInfo[i].pcbpara=this.$store.state.data.numberDF
        i=this.$myF.arrIndex(this.$store.state.data.pcbInfo,"制板要求：")
        this.$store.state.data.pcbInfo[i].pcbpara=""

        this.deliveryData()
       
       this.$store.state.data.pcbNewOrder.layer=this.$store.state.data.pcbLayer
    },
    deliveryData:function(){
        let days = 7 //默认6天交货
        let newDate = new Date(Date.now() + days*24*60*60*1000)
        this.$store.state.data.pcbNewOrder.deliveryData=newDate.getTime()
        let i=this.$myF.arrIndex(this.$store.state.data.pcbInfo,"交货日期：")
        this.$store.state.data.pcbInfo[i].pcbpara =newDate.getFullYear() + "年" + (newDate.getMonth() + 1) + "月" + newDate.getDate()+ "日";
    },

    changeOrderType: function (orderArea) {
      //通过订单面积获取编号的开头Y或P x
      this.$store.state.data.pcbNum.type = this.$myF.pcbType(orderArea);
      //通过后台获取流水号
      this.changeOrderNum(this.$store.state.data.pcbNum.type);
    },
    changeOrderNum: function (xory) {
      //这里就是获取我司流水号，实际运行的是D:\xampp\htdocs\t\application\pcb\controller\Login.php 下面的 pcbnum()函数
      this.$axios
        .post("/pcbnum", { xy: xory })
        //这里传入X或Y参数，给后台判断是编P的流水号，还是编Y的流水号
        .then((response) => {
          //后台获取流水号
          this.$store.state.data.pcbNum.num = response.data; //得到返回结果数据,这里就是后台返回来的流水编号
          //生产我司编号
          this.$store.state.data.pcbInfo[1].pcbpara =
            this.$store.state.data.pcbNum.type +
            this.$store.state.data.pcbNum.custId +
            this.$store.state.data.pcbNum.layer +
            this.$store.state.data.pcbNum.num;
        })
        .catch((error) => {
          console.log("错误" + error.message);
        });
    },
    changeSize: function () {
      //改变尺寸显示变化
   
      if (this.pcbp > 1) {
        this.$store.state.data.pcbInfo[this.sizeLb].pcbpara =
          this.pcbx + "*" + this.pcby + "/" + this.pcbp;
      } else {
        this.$store.state.data.pcbInfo[this.sizeLb].pcbpara =
          this.pcbx + "*" + this.pcby;
      }
    },
    countInput(v) {
      //限制只能输入整整数
      this.count = this.$myF.inputInt(v);
    },
    pcbxInput(v) {
      //通过输入事件触发计算属性和监听属性，会进行相关计算
      this.pcbx = v;
    },
    pcbyInput(v) {
      //通过输入事件触发计算属性和监听属性，会进行相关计算
      this.pcby = v;
    },
    pcbpInput(v) {
      //限制只能输入整整数
      console.log(v);
      this.pcbp = this.$myF.inputInt(v);

      if (!(this.pcbp >= 1)) {
        this.pcbp = 1;
      }
    },
    onSubmit(formName) {
      

      
      let vaildres
      //组件自动验证表单项目是否填写
      this.$refs[formName].validate((valid) => {
        if (valid) {
          vaildres=true
        } else {
          vaildres=false
          return false;
        }
      });
      //表单填写完成才继续一下一步，否则停止执行
      if(!vaildres){
        return false
      }
     
     
           if(!this.$store.state.data.pcbNewOrder.file || this.$store.state.data.pcbNewOrder.file==this.$store.state.data.fileInfo){
          this.$alert('请先上传PCB文件！', '未上传PCB文件', {
          confirmButtonText: '确定',
          type: 'warning',
          center: true,
          closeOnClickModal:true,
        });
        return false
      }
     
     
     let i
        //提交订单按钮触发的事键
        //工作流程：1获取数据->2整理数据->3校验数据->4弹窗体提示->5发送ajax请求->6返回结果->7继续下单或工艺下单->8数据初始化
        

        //1获取数据
        let submitData=JSON.parse(JSON.stringify(this.$store.state.data.pcbInfo));//深度拷贝，直接=赋值是一个地址，会改变原数据
        this.$store.state.data.pcbNewOrder.orderTime=new Date().getTime(); //提交下单时间搓

        
        //2整理数据
        //写入文本和数据库的信息进行整体和添加，这里都是提交到后台的信息
        //设置为item 值reserved不写入txt文本
        //设置为key值 reserved不写入数据库
        
        
        
        
            
 
        //对制板要求进行条理化
     
        
              
         //添加我司编号和周期要求 有8种情况
           let addNoPeriod
           let addNo
           let addPeriod
           i=this.$myF.arrIndex(this.$store.state.data.pcbInfo,"板内增加生产周期：")
           addPeriod=this.$store.state.data.pcbInfo[i].pcbpara
           submitData[i].item="reserved"//不写入txt
          
          i=this.$myF.arrIndex(this.$store.state.data.pcbInfo,"板内增加我司编号：")
           addNo=this.$store.state.data.pcbInfo[i].pcbpara
           submitData[i].item="reserved"//不写入txt
          
          if(addNo=="需要" && addPeriod!="不需要"){addNoPeriod=`板上要加我司编号和生产周期(${addPeriod})`}
           else if(addNo=="不需要" && addPeriod!="不需要"){addNoPeriod=`板上不加我司编号、要加生产周期(${addPeriod})`}
           else if(addNo=="不需要" && addPeriod=="不需要"){addNoPeriod="板上不加我司编号、不加生产周期"}
           else if(addNo=="需要" && addPeriod=="不需要"){addNoPeriod="板上要加我司编号和不加生产周期"}
           else{addNoPeriod="板上要加我司编号和生产周期(周年格式)"}

  
        submitData.push( 
                      {
                        "item": "1.", 
                        "pcbpara":addNoPeriod,
                        "key":"reserved"
                      })
        
        
        //写入客户默认的制板要求
        let serial=2 //自定义制板要求序号的开始，第一条制板要求是关于增加生产编号和周期的，后面些客户特定的要求

  
        
        
        
        //写入自定义制板要求
        i=this.$myF.arrIndex(this.$store.state.data.pcbInfo,"制板要求：")
        submitData[i].item="reserved"//不显示原始的制板要求
        let require=submitData[i].pcbpara
            if(require!=""){
            
            require = require.replace(/；/g, ';');
            require = require.split(";")
            require.forEach( function(item,index){
                    submitData.push( 
                      {
                        "item": serial+".", 
                        "pcbpara":item,
                        "key":"reserved"
                      })
                      serial+=1

                      })
            
            
            }
        //单面板在txt里面特别注明，并且过孔处理不写入txt
        i=this.$myF.arrIndex(this.$store.state.data.pcbInfo,"板子层数：")
        submitData[i].item="reserved"  //取消写入文本都内容
        if(submitData[i].pcbpara==1){
                  i=this.$myF.arrIndex(this.$store.state.data.pcbInfo,"过孔处理：")
                  addNo=this.$store.state.data.pcbInfo[i].pcbpara
                  submitData[i].item="reserved"//不写入txt
                  submitData[i].key="reserved"//不写入数据库
                  submitData.push( 
                      {
                        "item": serial+".", 
                        "pcbpara":"单面板工艺",
                        "key":"reserved"
                      })

        }
        
        
        
        
        //因为对制板要求重新编辑后跑到了交货日期后面，所以要重新把交货日期调整到制板要求后面
        i=this.$myF.arrIndex(this.$store.state.data.pcbInfo,"交货日期：")
        submitData[i].item="reserved"
        submitData.push( 
                      {
                        "item": "交货日期：",
                        "pcbpara":submitData[i].pcbpara,
                        "key":"reserved"
                      })
        
        
        //添加要写入文本或数据库的内容
        submitData.push( 
           {
            "item": " ",
            "pcbpara": " ",
            "key":"reserved"
           },
          {
            "item": "客户单位：",
            "pcbpara": this.$store.state.data.coustomerName,
            "key":"customerName"
           },
         
             {
            "item": "reserved",
            "pcbpara": this.$store.state.data.pcbNewOrder.unit, //板子数量的单位set 大片 pcs
            "key":"unit"
           },
             {
            "item": "reserved",
            "pcbpara": this.$store.state.data.pcbNewOrder.pcby, 
            "key":"pcbh"
           },
             {
            "item": "reserved",
            "pcbpara": this.$store.state.data.pcbNewOrder.pcbx, 
            "key":"pcbw"
           },
             {
            "item": "reserved",
            "pcbpara": this.$store.state.data.pcbNewOrder.pcbp, // //板子拼板数
            "key":"pcbp"
           },
             {
            "item": "首单面积：",
            "pcbpara": this.$store.state.data.pcbNewOrder.orderArea, 
            "key":"area"
           },
             {
            "item": "reserved",
            "pcbpara":this.$store.state.data.pcbNewOrder.orderTime, //下单时间
            "key":"orderTime"
           },
            {
            "item": "reserved",
            "pcbpara":this.$store.state.data.pcbNewOrder.deliveryData,  //交货日期
            "key":"deliveryData"
          }
           )

        
        
        
       //3校验数据
      
    
       //4弹窗体提示
      //这加一个确认弹窗，把写入txt文本内容呈现出来，确认后才会提交到后台
        let msg=""
       submitData.forEach(function(v){
            if(v.item!="reserved"){
                msg=msg+"<div style='font-size:1.4em;'><b>"+v.item+"</b>"+v.pcbpara+'</br></div>'
            }

       })
       this.postdata=submitData
       this.submitMsg(msg)
      
      //5发送ajax请求->6返回结果->7继续下单或工艺下单->8数据初始化



    },
    open(ms, titel) {
      //这里是提交到后台后返回的数据，进行弹窗提示
      //提交的确认弹窗
      this.$confirm(ms, titel, {
        confirmButtonText: "继续下新单",
        cancelButtonText: "同工艺下单",
        type: "success",
        center: true,
        closeOnClickModal: false,
      })
        .then(() => {
          this.mustreset('ruleForm')  //必须重置的参数
          this.$store.state.data.coustomerID=1//默认客户
          this.orderDf()//默认工艺
          this.$message({
            type: "success",
            message: "继续下新单!",
          });
        })
        .catch(() => {
          this.mustreset('ruleForm') //必须重置的参数
          this.$message({
            type: "warning",
            message: "同工艺下单",
          });
        });
    },
    submitMsg(msg) {
      //提交的确认弹窗
      this.$confirm(msg, "请确认工艺", {
        confirmButtonText: "确认提交",
        cancelButtonText: "再检查一下",
        closeOnClickModal: false,
        // type: 'success',
        //center: true,
        dangerouslyUseHTMLString: true,
      })
        .then(() => {
          this.subbmitAjax(this.postdata);
          this.$message({
            type: "success",
            message: "正在提交!",
          });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "取消提交",
          });
        });
    },
    subbmitAjax(postdata) {
      let postData = JSON.stringify(postdata); //数组转换为JSON字符串，作为poSt请求的参数
      this.$axios
        .post("/submitorder", postData)
        .then((response) => {
          console.log("正确" + response.data); //得到返回结果数据
          
          if(response.data.error=="1"){
          this.open(response.data.msg, response.data.titel);
          }else{
                   this.$alert(response.data.msg, response.data.titel, {
                confirmButtonText: '确定',
                type: 'warning',
                center: true,
                closeOnClickModal:true,
              });
          }
            

        })
        .catch((error) => {
          console.log("错误" + error.message);
        });
    },

  },//自定方法结束位置
  beforeCreate: function () {
    //组件被创建之前执行
    //通过路由传过的订单数量赋值给VUEX
   
    this.$store.state.data.pcbNewOrder.file=this.$store.state.data.fileInfo
    
      if (this.$route.query.count) {
        this.$store.state.data.pcbNewOrder.orconut = parseInt(
      this.$route.query.count
    ); //数量
    }
 

    //如果路由传过层信息存在，就把层信息显示到工艺参数详情
    if (this.$route.query.layer) {
      this.$store.state.data.pcbNewOrder.layer = this.$route.query.layer;
    }
    if (this.$route.query.x) {
      this.$store.state.data.pcbNewOrder.pcbx = this.$route.query.x;
    }
    if (this.$route.query.y) {
      this.$store.state.data.pcbNewOrder.pcby = this.$route.query.y;
    }
  },

  created: function () {
    //窗口被创建后执行,初始化板子参数信息
  
      this.deliveryData()
    this.$store.state.data.pcbInfo[
      this.layerLb
    ].pcbpara = this.$store.state.data.pcbNewOrder.layer;
    this.$store.state.data.pcbInfo[this.countLb].pcbpara =
      this.count + " " + this.$store.state.data.pcbNewOrder.unit;

    if (
      this.$store.state.data.pcbNewOrder.pcbx &&
      this.$store.state.data.pcbNewOrder.pcby
    ) {
      this.$store.state.data.pcbInfo[this.sizeLb].pcbpara =
        this.pcbx + "*" + this.pcby;
    }
  },
  watch: {
    count: function (val) {
      //监听数量变化
      this.ruleForm.count=val
      this.$store.state.data.pcbNewOrder.orconut = val;
      this.$store.state.data.pcbInfo[this.countLb].pcbpara =
        this.$store.state.data.pcbNewOrder.orconut +
        " " +
        this.$store.state.data.pcbNewOrder.unit;

      //计算我司编号的Y和P
      //计算订单面积
      let orderArea = this.$myF.calculateArea(
        this.$store.state.data.pcbNewOrder.pcbx,
        this.$store.state.data.pcbNewOrder.pcby,
        val,
        this.pcbp,
        this.$store.state.data.pcbNewOrder.unit
      );
      this.$store.state.data.pcbNewOrder.orderArea = orderArea;

      //订单面积大于2平米 编号P开头
      this.changeOrderType(orderArea);
    },
    pcbx: function (val) {
      //监听X尺寸变化
      if (!this.pcby) {
        this.pcby = "";
      }
      //计算订单面积
      let orderArea = this.$myF.calculateArea(
        val,
        this.$store.state.data.pcbNewOrder.pcby,
        this.count,
        this.pcbp,
        this.$store.state.data.pcbNewOrder.unit
      );
      this.$store.state.data.pcbNewOrder.orderArea = orderArea;
      //订单面积大于2平米 编号P开头
      this.changeOrderType(orderArea);
      this.$store.state.data.pcbNewOrder.pcbx = val;
      //改变工艺详情尺寸显示变化
      this.changeSize();
    },
    pcby: function (val) {
      //监听y尺寸变化
      if (!this.pcbx) {
        this.pcbx = "";
      }

      //计算订单面积
      let orderArea = this.$myF.calculateArea(
        this.$store.state.data.pcbNewOrder.pcbx,
        val,
        this.count,
        this.pcbp,
        this.$store.state.data.pcbNewOrder.unit
      );
      this.$store.state.data.pcbNewOrder.orderArea = orderArea;
      //订单面积大于2平米 编号P开头
      this.changeOrderType(orderArea);

      this.$store.state.data.pcbNewOrder.pcby = val;
      //改变工艺详情尺寸显示变化
      this.changeSize();
    },
    pcbp: function (val) {
      this.$store.state.data.pcbNewOrder.pcbp = val;
      //计算订单面积
      let orderArea = this.$myF.calculateArea(
        this.$store.state.data.pcbNewOrder.pcbx,
        this.$store.state.data.pcbNewOrder.pcby,
        this.count,
        val,
        this.$store.state.data.pcbNewOrder.unit
      );
      this.$store.state.data.pcbNewOrder.orderArea = orderArea;
      //订单面积大于2平米 编号P开头
      this.changeOrderType(orderArea);
      //改变工艺详情尺寸显示变化
      this.changeSize();
    },
    unit: function (val) {
      //订单数量单位 PCS SET  大片
      this.$store.state.data.pcbNewOrder.unit = val;
      this.$store.state.data.pcbInfo[this.countLb].pcbpara =
        this.$store.state.data.pcbNewOrder.orconut +
        " " +
        this.$store.state.data.pcbNewOrder.unit;
      //计算订单面积
      let orderArea = this.$myF.calculateArea(
        this.$store.state.data.pcbNewOrder.pcbx,
        this.$store.state.data.pcbNewOrder.pcby,
        this.count,
        this.$store.state.data.pcbNewOrder.pcbp,
        val
      );
      this.$store.state.data.pcbNewOrder.orderArea = orderArea;

      //订单面积大于2平米 编号P开头
      this.changeOrderType(orderArea);

      this.changeSize();
    },
  },


};
</script>

<style>
.copyico{
  margin-left: 10px;
}

.pcbbase {
  margin-bottom: 8px;
}
.text .fengexian {
  margin-top: 0px;
  margin-bottom: 10px;
}
.pcbp {
  margin-top: 6px;
}

.tijiao .el-button {
  padding-right: 100px;
  padding-left: 100px;
}

.hidenbroad .el-input__inner{
    border-bottom-color:#fff;
    border-radius:4px 4px 0px 0px;
    border-color: #c0c4cc  #c0c4cc #fff  #c0c4cc;
}




</style>

<style scoped>
.inputcount >>> .el-input__inner:hover{
 border-bottom-color:#fff;
  border-radius:4px 4px 0px 0px;

}

.inputfocus >>> .el-input__inner:focus{
  border-color: #c0c4cc  #c0c4cc #fff  #c0c4cc;
  border-bottom-color:#fff;
}

.inputcount {

  z-index: 3;
}
.inputcount >>> .el-input__inner {
  transition:none;

}

.contLabel{
  position: absolute;
  width: 610px;

  border:1px solid #C0C4CC;
  box-shadow: 0px 1px 3px #dbdbdb;
  top:39px;
  left: 100px;
  z-index: 1;
  background: #fff;
  overflow: hidden;
  display: none;


}
.showconut{
  display: block;
}
      .scroll-num {
        height: 20px;
        padding: 0 2px;
        line-height: 20px;
        font-weight: 700;
        color: #fe6700;
      }

      .customerno .el-col{
             font-size: 20px;
              color: #606266;
      }
      .orderarea,.customerno,.pcborder .item,.PcbCopper{
           margin-bottom: 0px;
      }
</style>